<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@include file="/WEB-INF/jsp/teacher/common/header.jsp" %>
<div class="clearfix"></div>
<div class="row">
    <div class="col-md-12">
        <div class="x_panel">
            <div class="x_title">
                <h2>
                    <form id="myForm" action="${pageContext.request.contextPath }/teacher/toShowGrade">
                        <select name="college" onchange="toShowGrade()" <c:if test="${teacher.type!=3}"> disabled="disabled" </c:if>>
                            <c:forEach var="colleges" items="${colleges}">
                                <option value="${colleges.college}"
                                        <c:if test="${show==colleges.college}">selected="selected"</c:if>>
                                        ${colleges.college}
                                </option>
                            </c:forEach>
                        </select>
                        可视化视图
                    </form>
                </h2>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
    <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel">
            <div class="x_content">
                <p class="text-muted font-13 m-b-30"></p>
                <div id="datatable-responsive_wrapper"
                     class="dataTables_wrapper form-inline dt-bootstrap no-footer">
                    <div class="row">
                      <div id="main" style="width: 600px;height: 400px;">
                      </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<%@include file="/WEB-INF/jsp/teacher/common/footer.jsp" %>
<script src="${pageContext.request.contextPath }/statics/js/echarts.min.js"></script>
<script type="text/javascript">
    view();
    function view(){
        var myChart = echarts.init(document.getElementById('main'));
        // 指定图表的配置项和数据
        var option = {
            title : {
                text : '学生综合素质平均成绩'
            },
            tooltip : {},
            legend : {
                data : [ '成绩' ]
            },
            xAxis : {
                data : [ "思想素质分", "文化素质分", "身心素质分", "人文素质分", "职业素质分" ]
            },
            yAxis : {},
            series : [ {
                name : '销量',
                type : 'bar',
                data : [${grade.iq},${grade.cq},${grade.pmq},${grade.hq},${grade.pq}]
            } ]
        };
        myChart.setOption(option);
    }
    function toShowGrade() {
        var form = document.getElementById("myForm");
        form.submit();
    }
</script>